//过渡
.fade-move-enter-active,
.fade-move-leave-active {
  transition: 0.3s all ease;
  // position: absolute
}

.fade-move-enter,
.fade-move-leave-to {
  opacity: 0;
  transform: translateX(-100px);
}
.fade-move-enter-to,
.fade-move-leave {
  opacity: 1;
  transform: translateX(0);
}

//打字机效果
.typewriting-animation {
  // position: absolute;
  display: inline-block;
  overflow: hidden;
  width: 0;
  height: 30px;
  // background-color: pink;
  white-space: nowrap;
  /*steps 就是分几步来完成我们的动画 有了steps 就不要再写 ease 或者linear了*/
  animation: w 4s steps(4) infinite;
}

@keyframes w {
  0% {
    width: 0;
  }

  100% {
    width: 200px;
  }
}
